<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Boot WMS</title> 
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="plugins/fontawesome-free/css/all.min.css"> 
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"> 
  <!-- Tempusdominus Bbootstrap 4 -->
  <link rel="stylesheet" href="plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
  <!-- iCheck -->
  <link rel="stylesheet" href="plugins/icheck-bootstrap/icheck-bootstrap.min.css">
  <!-- JQVMap -->
  <link rel="stylesheet" href="plugins/jqvmap/jqvmap.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="dist/css/adminlte.min.css">
  <!-- overlayScrollbars -->
  <link rel="stylesheet" href="plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
  <!-- Daterange picker -->
  <link rel="stylesheet" href="plugins/daterangepicker/daterangepicker.css">
  <!-- summernote -->
  <link rel="stylesheet" href="plugins/summernote/summernote-bs4.css"> 
  <!-- Google Font: Source Sans Pro -->
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
</head>
<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">

  <!-- Navbar -->
  <nav class="main-header navbar navbar-expand navbar-white navbar-light">  
	<div id="test1"></div> 
	<div id="test2"></div>
    
    <ul class="navbar-nav ml-auto"> 
		<div id="test3"></div> 
		<div id="test4"></div>
		<li class="nav-item">
		  <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#">
		    <i class="fas fa-th-large"></i>
		  </a>
		</li>
    </ul>
  </nav>
  <!-- /.navbar -->


  <aside class="main-sidebar sidebar-dark-primary elevation-4">
  	<div id="logo1"></div> 
    <div class="sidebar">
		<div id="user1"></div>
		<nav class="mt-2">
			 <ul class="nav nav-pills nav-sidebar flex-column" 
			 	 data-widget="treeview" 
			 	 role="menu" 
			 	 data-accordion="false">
			 	<div id="menu1"></div> 
		 	 </ul>
		</nav>
  	</div> 
  </aside>  


  <div class="content-wrapper">
    <div class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
		      <h1 class="m-0 text-dark">
		      	Gjj Boot WMS
		        <small>演示系统</small>
		      </h1>
	      </div>
          <div class="col-sm-6">
      	    <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="#"><i class="fa fa-dashboard">主页</i></a></li>
              <li class="breadcrumb-item active">首页告示</li> 
            </ol>
          </div>
        </div>
      </div>
    </div>
    
    
	<section class="content">
      <div class="container-fluid">
      <div class="row">
      
        <div class="col-lg-3 col-xs-6">
          <div class="small-box bg-info">
            <div class="inner">
              <!-- <h3>150</h3> -->
              <div id="weiRuKuDanShu1"></div>
              
              <p>未入库单数</p>
            </div> 
          
            <div class="icon">
              <i class="fa fa-shopping-cart"></i> 
            </div>
          
            <a href="#" class="small-box-footer">
           	   更多信息 
            <i class="fa fa-arrow-circle-right"></i></a>
          </div>
            
    	</div>
      
      
        <div class="col-lg-3 col-xs-6"> 
          <div class="small-box bg-green">
            <div class="inner"> 
			  <!-- <h3>330</h3> -->
              <div id = "xuChuKuDanShu1"></div>
              <p>需出库单数</p>
            </div>
            <div class="icon"> 
             	<i class="fa fa-file-text-o"></i>
            </div>
            <a href="#" class="small-box-footer">
            	更多信息
            	<i class="fa fa-arrow-circle-right"></i>
            </a>
            
          </div>
        </div>
      
        <div class="col-lg-3 col-xs-6">
          <div class="small-box bg-yellow">
            <div class="inner">
              <!-- <h3>44</h3> -->
				<div id="xuFaCheYunDanShu"></div>
              <p>需发车运单数</p>
            </div>
            <div class="icon"> 
              <i class="fa fa-truck"></i>
            </div>
            
            <a href="#" class="small-box-footer">
            	更多信息 
            <i class="fa fa-arrow-circle-right"></i></a>
      
      	  </div>
      	</div>
      
      
        <div class="col-lg-3 col-xs-6">
          <div class="small-box bg-red">
            <div class="inner">
              <!-- <h3>65%</h3> -->
			  <div id="cangKuBaoHeDu1"></div>
              <p>仓库饱和度</p>
            
            </div>
            <div class="icon">
              <i class="ion ion-pie-graph"></i>
            </div>
            
            <a href="#" class="small-box-footer">
            	更多信息 <i class="fa fa-arrow-circle-right"></i>
            </a>
          
          </div>
        </div>
      
      </div>
      <!-- ---------------------------------- -->
      <!-- Main row -->
      <div class = "row">
      	<!-- Left col -->
        <section class="col-lg-7 connectedSortable">
          <div class="card">
          	<div id="toDoList"></div>
          </div>
      	  
          <div class="card">
          	<div id="quickMail"></div>
          </div>
        
        </section>
        <!-- /.Left col -->
        
        <!-- Right row -->
        <section class="col-lg-5 connectedSortable">
        
          <div class="card bg-gradient-success">
          	<div id="calendar2"></div> 
          	
              <div class="card-body pt-0">
                <!--The calendar -->
                <div id="calendar" style="width: 100%"></div>
              </div>
              <!-- /.card-body --> 
              
            <div class="card-footer text-black bg-white">
              <div class="row">
                <div class="col-sm-6">
                  <!-- Progress bars -->
                  <div class="clearfix">
                    <span class="pull-left">
                    	#1
                    </span>
                    <small class="pull-right">
                    	完成四号库区的扩建
                    </small>
                  </div>
                  <div class="progress progress-sm">
                    <div class="progress-bar bg-green" style="width: 90%"></div>
                  </div>

                  <div class="clearfix">
                    <span class="pull-left">
                    	#2
                    </span>
                    <small class="pull-right">
                    	完成与苹果的合作
                    </small>
                  </div>
                  <div class="progress progress-sm">
                    <div class="progress-bar bg-green" style="width: 70%"></div>
                  </div>
                </div>
                <!-- /.col -->
                <div class="col-sm-6">
                  <div class="clearfix">
                    <span class="pull-left">
                    	#3
                    </span>
                    <small class="pull-right">
                    	收入第一批苹果货物
                    </small>
                  </div>
                  <div class="progress progress-sm">
                    <div class="progress-bar bg-green" style="width: 60%"></div>
                  </div>

                  <div class="clearfix">
                    <span class="pull-left">
                    	#4
                    </span>
                    <small class="pull-right">
                    	完成买家订货出库
                    </small>
                  </div>
                  <div class="progress progress-sm">
                    <div class="progress-bar bg-green" style="width: 40%"></div>
                  </div>
                </div>
                <!-- /.col -->
              </div>
              <!-- /.row -->
            </div>
            
          </div>
          
          <div class="card">
          	<div id="productList"></div>
          </div>
        </section>
        <!-- /.Right col -->
        
       </div>
      </div>
    </section>
  </div>

<div id="footer"></div>

	<!-- 右边弹出侧边栏 -->
  <aside class="control-sidebar control-sidebar-dark">
  	<div id="rightSidebarTab1"></div>
    <div class="tab-content">
      <div id="rightSidebarTab2"></div>
    </div>
  </aside>

</div>

<!-- Vue -->
<script src="dist/js/vue.min.js"></script>
<!-- jQuery -->
<script src="plugins/jquery/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="plugins/jquery-ui/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
  $.widget.bridge('uibutton', $.ui.button)
</script>
<!-- Bootstrap 4 -->
<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- ChartJS -->
<script src="plugins/chart.js/Chart.min.js"></script>
<!-- Sparkline 
<script src="plugins/sparklines/sparkline.js"></script> -->
<!-- JQVMap -->
<script src="plugins/jqvmap/jquery.vmap.min.js"></script>
<script src="plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
<!-- jQuery Knob Chart -->
<script src="plugins/jquery-knob/jquery.knob.min.js"></script>
<!-- daterangepicker -->
<script src="plugins/moment/moment.min.js"></script>
<script src="plugins/daterangepicker/daterangepicker.js"></script>
<!-- Tempusdominus Bootstrap 4 -->
<script src="plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
<!-- Summernote -->
<script src="plugins/summernote/summernote-bs4.min.js"></script>
<!-- overlayScrollbars -->
<script src="plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
<!-- AdminLTE App -->
<script src="dist/js/adminlte.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="dist/js/demo.js"></script>
</body>
<script type="text/javascript">
	console.log("step1");
	//1
	console.log("1,代办事项，区域是因为都是通过EDI即时导入的，可以查看当前发生的单据");
	//10
	console.log("当时就发现，国内的软件需求者，并不是盲目的跟着国外软件规定走，而是大多将自己的业务逻辑绑定到所需要的软件上");
	
	(function($){
		console.log("start");
		
		localStorage.setItem("menuId", 0);
		
		//$("#mainHeader").load("mainHeader1.html");
		$("#test1").load("test1.html");
		$("#test2").load("test2.html");
		$("#test3").load("test3.html");
		$("#test4").load("test4.html");
		$("#logo1").load("logo1.html");
		$("#user1").load("user1.html");
		$("#menu1").load("menu1.html");
		$("#footer").load("foot.html");
		
		
		$("#toDoList").load("todoList2.html");
		$("#quickMail").load("quickMail1.html");
		$("#calendar2").load("calendar2.html");
		$("#productList").load("productList2.html");
		

	    $('#calendar').datetimepicker({
	      format: 'L',
	      inline: true
	    })
		sessionStorage.setItem("menuId",-1)
		initialBoradData();
	    initialMenuList();
	})(jQuery);

	function initialBoradData(){
		console.log("initialBoradData");
		
		var wrkds = '<h3>150</h3>';
		$("#weiRuKuDanShu1").html(wrkds);
		var xckds = '<h3>65</h3>';
		$("#xuChuKuDanShu1").html(xckds); 
		var xfcyds = '<h3>44</h3>';
		$("#xuFaCheYunDanShu").html(xfcyds);
		var ckbhd = '<h3>53<sup style="font-size: 20px">%</sup></h3>';
		$("#cangKuBaoHeDu1").html(ckbhd);
	}

	function initialMenuList(){
		console.log("initialMenuList()")
		setTimeout(()=>{
			changeMenuActive(-1)	
		},500)
		
	}
	
</script>
</html>

